<template>
  <div v-if="isShow">
    <van-cell-group>
      <van-cell is-link @click="showPopupFullCut = true" v-if="fullCutList.length>0">
        <div slot="icon">
          <van-tag class="tag" type="primary">店铺 | 促销</van-tag>
        </div>
        <div slot="title" class="title">
          <span>{{fullCutFirstTitle}}</span>
        </div>
      </van-cell>
      <van-cell is-link @click="showPopupCoupon = true" v-if="couponList.length>0">
        <div slot="icon">
          <van-tag class="tag" type="danger">店铺 | 优惠券</van-tag>
        </div>
        <div slot="title" class="title">
          <span>{{couponFirstTitle}}</span>
        </div>
      </van-cell>
      <van-cell v-if="commissionText">
        <div slot="icon">
          <van-tag class="tag" color="#7232dd">返{{commissionSetText}}</van-tag>
        </div>
        <div slot="title" class="title">
          <span>{{commissionText}}</span>
        </div>
      </van-cell>
      <van-cell v-if="pointInfo.is_point == 1 && pointInfo.point > 0">
        <div slot="icon">
          <van-tag class="tag" type="success">返{{$store.state.member.memberSetText.point_style}}</van-tag>
        </div>
        <div slot="title" class="title">
          <span>购买可得{{pointInfo.point}}{{$store.state.member.memberSetText.point_style}}</span>
        </div>
      </van-cell>
    </van-cell-group>
    <PopupFullCut
      v-model="showPopupFullCut"
      :items="fullCutList"
      :title="shopName"
      v-if="fullCutList.length>0"
    />
    <PopupCoupon
      v-model="showPopupCoupon"
      :items="couponList"
      :title="shopName"
      :get-type="5"
      v-if="couponList.length>0"
    />
  </div>
</template>

<script>
import { isEmpty } from "@/utils/util";
import PopupFullCut from "@/components/PopupFullCut";
import PopupCoupon from "@/components/PopupCoupon";
export default {
  data() {
    return {
      showPopupCoupon: false,
      showPopupFullCut: false
    };
  },
  props: {
    shopName: {
      type: String
    },
    fullCutList: {
      type: Array
    },
    couponList: {
      type: Array
    },
    pointInfo: {
      type: Object
    },
    commissionInfo: {
      type: Object
    }
  },
  computed: {
    isShow() {
      return (
        this.fullCutList.length > 0 ||
        this.couponList.length > 0 ||
        this.pointInfo.is_point == 1 ||
        this.commissionText
      );
    },
    couponFirstTitle() {
      const item = this.couponList[0];
      let text = "";
      if (item) {
        var money = parseFloat(item.money),
          at_least = parseFloat(item.at_least),
          discount = parseFloat(item.discount);
        if (item.coupon_genre == 1) {
          text = "无门槛" + money + "元";
        } else if (item.coupon_genre == 2) {
          text = "满" + at_least + "元减" + money + "元";
        } else if (item.coupon_genre == 3) {
          text = "满" + at_least + "元" + discount + "折";
        }
      }
      return text;
    },
    fullCutFirstTitle() {
      const item = this.fullCutList[0] ? this.fullCutList[0].rules[0] : "";
      let text = "";
      if (item) {
        let discount = parseFloat(item.discount);
        let price = parseFloat(item.price);
        let free_shipping = parseInt(item.free_shipping);
        let i = 0;
        if (discount > 0) {
          text += `${(i += 1)}、满${price}减${discount}元；`;
        }
        if (free_shipping) {
          text += `${(i += 1)}、满${price}包邮；`;
        }
        if (item.coupon_type_id) {
          text += `${(i += 1)}、满${price}送优惠券(${item.coupon_type_name})；`;
        }
        if (item.gift_card_id) {
          text += `${(i += 1)}、满${price}送礼品券(${
            item.gift_voucher_name
          })；`;
        }
        if (item.gift_id) {
          text += `${(i += 1)}、满${price}送赠品(${item.gift_name})；`;
        }
      }
      return text;
    },
    commissionSetText() {
      return this.$store.state.member.commissionSetText
        ? this.$store.state.member.commissionSetText.commission
        : "佣金";
    },
    commissionText() {
      let text = "";
      const { commission, dis_point } = this.commissionInfo;
      if (parseFloat(commission)) {
        text = commission + this.commissionSetText;
      }
      if (parseFloat(dis_point)) {
        text += commission ? "+" : "";
        text += dis_point + this.$store.state.member.memberSetText.point_style;
      }
      return text;
    }
  },
  components: {
    PopupFullCut,
    PopupCoupon
  }
};
</script>
<style scoped>
.tag {
  margin-right: 5px;
}

.title {
  padding: 0 6px;
  font-size: 12px;
  color: #606266;
  white-space: nowrap;
  max-width: 180px;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
}
</style>
